<template>
  <view class="detail-base-info">
    <view v-for="(baseInfo, index) in listData" class="section">
      <template>
        <view>
          <view class="section-title">
            <text class="icon" />
            <text class="text">
              {{ '附件 ' + (index + 1) }}
            </text>
          </view>
          <view v-for="(item, index) in baseInfo" class="section-body">
            <base-info-item
              :key="index"
              :field="item"
              :detail-data="detailData" />
          </view>
          <view style="padding: 10px;">
            <button type="primary">
              上传附件
            </button>
            <uni-file-picker
              v-model="files"
              :auto-upload="false"
              file-mediatype="all" 
              file-extname="dot,doc,xls,xlsx,docx,pdf"
              mode="grid" 
              :limit="1"
              @select="uploadAfterSelect" 
            />
          </view>
        </view>
      </template>
    </view>
  </view>
  </view>
</template>

<script>
  import BaseInfoItem from './baseInfoItem'
  import {querySrmXjOrderFileListByOrderId} from 'API/inqueryMessage'

  export default {
    name: 'AttachFile',
    components: {
      BaseInfoItem
    },
    props: {
      detailId: {
        type: [String, Number],
        required: true
      },
      detailData: {
        type: Object,
        default: () => {}
      },
    },
    data() {
      return {
        files: [],
        baseInfo: [],
        listData: [],
        showBaseInfo: true
      }
    },
    wkActivated() {
      this.showBaseInfo = false
      this.$nextTick(function() {
        this.showBaseInfo = true
      })
    },
    mounted() {
      this.getFieldList()
    },
    methods: {
      /**
       * 获取自定义字段信息
       */
      getFieldList() {
        querySrmXjOrderFileListByOrderId({
          orderId: this.detailId
        }).then(res => {
          this.listData = []
          if (res.data != undefined && res.data instanceof Array) {
            res.data.forEach((item, index) => {
              let temps = item.fileUrl ? item.fileUrl.split('.') : []
              let ext = ''
              if (temps.length > 0) {
                ext = temps[temps.length - 1].toLowerCase()
              } else {
                ext = ''
              }
              this.listData.push(
                [{
                   name: '附件类型',
                   value: item.fileType == 1 ? '供应商上传' : '采购方',
                   formType: 'info'
                 },
                 {
                   name: '上传的供应商',
                   value: item.gysBasicInfoName,
                   formType: 'info'
                 },
                 {
                   name: '附件',
                   value: [{
                     name: item.fileName + '.' + ext,
                     url: item.fileUrl
                   }],
                   formType: 'file'
                 }]
              )
            })
          }
        })
      },
      uploadAfterSelect() {
		  
      }
    }
  }
</script>

<style scoped lang="scss">
.detail-base-info {
  .section {
    width: 100%;
    background-color: white;
    padding: 32rpx 0 20rpx;
    margin-bottom: 15rpx;
    &:first-child {
      border-radius: 18rpx 18rpx 0 0;
    }
    .section-title {
      padding: 0 25rpx;
      .icon {
        width: 15rpx;
        height: 15rpx;
        vertical-align: middle;
        background-color: #333333;
        border-radius: 50%;
        display: inline-block;
        margin-right: 15rpx;
      }
      .text {
        color: #212121;
        font-size: 28rpx;
      }
    }
    .section-body {

    }
  }
}
</style>
